<template>
    <div>
    <ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
					<router-link :to="'/home/newsinfo/'+item.id">
						<img class="mui-media-object mui-pull-left" :src="item.img_url" >
						<div class="mui-media-body">
							<h1>{{item.title}}</h1>
							<p class="mui-ellipsis">
                                 <span>时间：{{item.add_time}}</span>
                                 <span>点击：{{item.click}}次</span>
                            </p>
						</div>
					</router-link>
				</li>
	</ul>
    </div>
</template>

<script>
import {Toast} from 'mint-ui';
export default {
    data(){
        return{
            newslist:[
                {
                    id:1,
                    title:"秀秀是个好看的妹子！",
                    add_time:"2019-10-11 12:49:29",
                    abstruct:"真心好看",
                    click:333,
                    img_url:require("../../images/newslist-a.jpg")

            },
                   {
                    id:2,
                    title:"秀秀是个善良的妹子！",
                    add_time:"2019-10-11 13:09:25",
                    abstruct:"很有爱心",
                    click:13,
                    img_url:require("../../images/newslist-b.jpg")

            },
                   {
                    id:3,
                    title:"秀秀是个活泼的妹子！",
                    add_time:"2019-10-11 24:02:29",
                    abstruct:"话很多",
                    click:24,
                    img_url:require("../../images/newslist-c.jpg")

            },

                   {
                    id:4,
                    title:"秀秀是个可爱的妹子！",
                    add_time:"2019-10-11 21:05:29",
                    abstruct:"总是卖萌",
                    click:32,
                    img_url:require("../../images/newslistd.jpg")

            },

                   {
                    id:5,
                    title:"秀秀不浪！",
                    add_time:"2019-10-11 23:09:29",
                    abstruct:"希望是这样",
                    click:46,
                    img_url:require("../../images/newsliste.jpg")

            },
                   {
                    id:6,
                    title:"秀秀是个勤快的妹子！",
                    add_time:"2019-10-11 22:09:29",
                    abstruct:"经常做家务",
                    click:34,
                    img_url:require("../../images/newslistf.jpg")

            },

                   {
                    id:7,
                    title:"秀秀是个贤惠的妹子！",
                    add_time:"2019-10-11 20:09:29",
                    abstruct:"会做饭",
                    click:65,
                    img_url:require("../../images/newslistg.jpg")

            },
                   {
                    id:8,
                    title:"秀秀是个爱干净的妹子！",
                    add_time:"2019-10-11 21:09:29",
                    abstruct:"屋子收拾的很整洁",
                    click:3,
                    img_url:require("../../images/newslisti.jpg")

            },
                   {
                    id:9,
                    title:"秀秀是个会打扮妹子！",
                    add_time:"2019-10-11 21:09:29",
                    abstruct:"我要让她越来越好看",
                    click:3,
                    img_url:require("../../images/newslisth.jpg")

            },
            ]
        };
    },

    methods:{
        // getNewsLists(){
        //     this.$http.get("api/getnewslist").then(result =>{
        //         //通过路径进行数据回调函数处理
        //         if(result.body.status === 0){
        //             //回调函数的参数获取数据并把需要渲染页面的数据放到当前对象的data里
        //             this.newslist = result.body.message;
        //         }else{
        //             Toast("获取新闻列表失败！")
        //         }
        //     })
        // }
    }


}
</script>



<style lang="scss" scoped>
.mui-table-view{
    li{
        h1{
            font-size: 14px;
         
        }
           .mui-ellipsis{
                font-size:12px;
                color:#222aff;
                display:flex;
                justify-content: space-between;

            }
    }
    img{
        width : 100%;
        height: 100%;
    }
}
</style>
